﻿@{
    ViewBag.Title = "Rock Paper Scissor";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<!--  
    
    Ska innehålla:

    - Titel (#title)
    - "Label" för att visa vems tur det är (#turn)
    - Knappar (Rock, Paper, Scissor)
    - Knapp för för "konfirmera" valet (Play)

    -->



<h2 id="title">Spelar @ViewBag.Title</h2>

<p id="info">Omgång <span id="currRound"></span> av @ViewBag.NumOfRounds</p>
<p id="turnInfo">!</p>
<p id="opponentInfo">1</p>

<!-- Submitta formuläret med AJAX -->

<form method="post" action="#" id="form"> <!-- Generellt namn om CSS filen ska användas på andra sidor(?) -->
        <fieldset>
            <legend>Make your choice:</legend>
                <input type="radio" name="choice" value="Rock" required/>Rock<br />
                <input type="radio" name="choice" value="Paper" />Paper<br />
                <input type="radio" name="choice" value="Scissor" />Scissor<br />
        </fieldset>
</form>
<input type="submit" id="submitBtn" value="Confirm & Play" />

<p id="debug">Debug window: </p>

<script>
    $("#submitBtn").on("click", function () {
        $.ajax({
            url: '@Url.Content("~/Home/SubmitTurn")',
            data: $('#form').serialize(),
            success: function (data) {
                // Do something with result
            }
        });
    });

    $(document).ready(function () {

        //Kalla på [funktion] som kollar vems tur det är varannan sekund

        $("#debug").append("Document ready .. <br>");

        setInterval(function () { checkTurn() }, 1000);

        setInterval(function () { checkOpponentStatus() }, 1000);

    });

    function checkTurn() {

        $("#turnInfo").html("My niggah!");

        $.get('@Url.Content("~/Home/CheckTurn")', function (data) {

            if (data.WinningPlayerID == null) {

                //Spelet är över
                //Hämta resultatet
                //Skicka spelaren till start - meddela att spelet är över, ge resultatet

                $("#debug").append("THE END, GOOD BYE. <br>");

            } else {

                //Do shit - spelet är igång

                var currentRoundValue = $("#currRound").html();
                var currentRound = $(data.PlayedGameRounds).size();
                //Kolla om det är dags för nästa runda

                if (currentRoundValue) { //Kollar inte om det är en ny runda förrän datan är hämtad
                    //Kan också lösas genom att den metod kallas på i success delen av get/ajax metoden

                    if (currentRound > currentRoundValue {

                        $("#debug").append("Ny runda! <br>");

                    }

                }

                $("#currRound").html(currentRound); //Visar vilken omgång som spelas nu
            }


        });
    }

    function checkOpponentStatus() {

        $.get('@Url.Content("~/Home/CheckOpponentStatus?playerId=1&gameSessionId=1")', function (data) {

            if (data == "True") {
                $("#opponentInfo").html("Your opponent has made a move. Now it's time for your choice!");
            } else if (data == "False") {
                $("#opponentInfo").html("Your opponent has not made a move yet.");
            }

            });
        }



</script>
